<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <title>首页</title>
    <meta name="viewport" content="width=device-width,target-densitydpi=high-dpi,initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0"/>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <link href="css/bootstrap.min.css" rel="stylesheet" />
    <link href="fontAwesome/css/font-awesome.min.css" rel="stylesheet">
    <link href="css/common.css" rel="stylesheet" />
    <link href="css/main.css" rel="stylesheet" />
    <script type="text/javascript" src="js/jquery.min.js"></script>
    <script type="text/javascript" src="js/bootstrap.js"></script>
  </head>
<body>
  <nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
    <div class="navbar-header">
        <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
            <span class="sr-only">Toggle navigation</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
        </button>
        <a class="navbar-brand" href="#">渠道管理<span class="f12">&nbsp;&nbsp;ERP</span></a>
    </div>
    <div id="navbar" class="collapse navbar-collapse">
      <ul class="nav navbar-nav">
        <li class="active"><a href="javascript:;">首页</a></li>
        <li><a href="javascript:;">机构管理</a></li>
        <li><a href="javascript:;">报备管理</a></li>
      </ul>
      <div class="login-settings">
        <a href="javascript:;" class="clearfix"  data-toggle="popover">
          <div class="loginImg"></div>
          <div class="loginName">木头</div>
          <i class="fa fa-caret-down"></i>
        </a>
      </div>
    </div>
  </nav>
  <div class="sidebar">
    <ul class="nav nav-sidebar">
      <li class="nav-parent active">
          <a href="#" class="nav-parent-title"><i class="fa fa-th-large iconLeft"></i>首页<i class="fa fa-angle-down iconRight"></i></a>
          <ul class="nav nav-children">
              <li><a href="javascript:;"><i class="fa fa-circle iconLeft"></i>二级导航</a></li>
              <li><a href="javascript:;"><i class="fa fa-circle iconLeft"></i>二级导航</a></li>
              <li><a href="javascript:;"><i class="fa fa-circle iconLeft"></i>二级导航</a></li>
          </ul>
      </li>
      <li class="nav-parent">
          <a href="#" class="nav-parent-title"><i class="fa fa-sitemap iconLeft"></i>机构管理<i class="fa fa-angle-down iconRight"></i></a>
          <ul class="nav nav-children">
              <li><a href="javascript:;"><i class="fa fa-circle iconLeft"></i>二级导航</a></li>
              <li><a href="javascript:;"><i class="fa fa-circle iconLeft"></i>二级导航</a></li>
              <li><a href="javascript:;"><i class="fa fa-circle iconLeft"></i>二级导航</a></li>
          </ul>
      </li>
      <li class="nav-parent">
          <a href="#" class="nav-parent-title"><i class="fa fa-edit iconLeft"></i>报备管理<i class="fa fa-angle-down iconRight"></i></a>
          <ul class="nav nav-children">
              <li><a href="javascript:;"><i class="fa fa-circle iconLeft"></i>二级导航</a></li>
              <li><a href="javascript:;"><i class="fa fa-circle iconLeft"></i>二级导航</a></li>
              <li><a href="javascript:;"><i class="fa fa-circle iconLeft"></i>二级导航</a></li>
              <li><a href="javascript:;"><i class="fa fa-circle iconLeft"></i>二级导航</a></li>
              <li><a href="javascript:;"><i class="fa fa-circle iconLeft"></i>二级导航</a></li>
          </ul>
      </li>
    </ul>
  </div>
  <div class="main">
    <div class="main-content">
      <h1 class="page-header">已获佣金合计：<strong>89,500.00</strong>元</h1>
      <div class="presentation-data row">
        <div class="col-lg-3 col-md-6">
          <div class="presentation-data-list">
            <div class="presentation-data-content">
              <h3 class="presentation-title">经纪人</h3>
              <p class="data-number">400</p>
            </div>
          </div>
        </div>
        <div class="col-lg-3 col-md-6">
          <div class="presentation-data-list">
            <div class="presentation-data-content">
              <h3 class="presentation-title">成交量</h3>
              <p class="data-number">99999999</p>
            </div>
          </div>
        </div>
        <div class="col-lg-3 col-md-6">
          <div class="presentation-data-list">
            <div class="presentation-data-content">
              <h3 class="presentation-title">报备数</h3>
              <p class="data-number">4008008</p>
            </div>
          </div>
        </div>
        <div class="col-lg-3 col-md-6">
          <div class="presentation-data-list">
            <div class="presentation-data-content">
              <h3 class="presentation-title">成交率</h3>
              <p class="data-number">99.9% </p>
            </div>
          </div>
        </div>
      </div>
      <div class="presentation-data row">
        <div class="col-sm-12 col-lg-4">
          <div class="presentation-data-header bgcol01">
            <div class="array-title-left">
              <i class="fa fa-money"></i><strong>佣金</strong>
            </div>
            <div class="array-list-right">
              <div class="dropdown clearfix btn-group">
                <button id="dLabel" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" class="bgcol01">最近30天
                 <i class="fa fa-angle-down"></i>
                </button>
                <ul class="dropdown-menu choice-list" role="menu" aria-labelledby="dLabel">
                  <li>最近3天</li>
                  <li>最近7天</li>
                  <li>最近30天</li>
                </ul>
              </div>
            </div>
            <!-- 下三角标签 -->
            <i class="fa fa-caret-down down-triangle"></i>
          </div>
          <ul class="presentation-array-list">
            <li>
              <div class="array-list-left">
                <span class="rank bgcol01">1</span>经纪人
              </div>
              <div class="array-list-right ellipsis">12000元</div>
            </li>
            <li>
              <div class="array-list-left">
                <span class="rank bgcol01">2</span>经纪人
              </div>
              <div class="array-list-right ellipsis">12000元</div>
            </li>
            <li>
              <div class="array-list-left">
                <span class="rank bgcol01">3</span>经纪人
              </div>
              <div class="array-list-right ellipsis">12000元</div>
            </li>
            <li>
              <div class="array-list-left">
                <span class="rank bgcol01">4</span>经纪人
              </div>
              <div class="array-list-right ellipsis">12000元</div>
            </li>
            <li>
              <div class="array-list-left">
                <span class="rank bgcol01">5</span>经纪人
              </div>
              <div class="array-list-right ellipsis">12000元</div>
            </li>
          </ul>
          <div class="more-ranking">
              <a href="javascript:;"><i class="fa fa-plus"></i>更多</a>
          </div>
        </div>
        <div class="col-sm-12 col-lg-4">
          <div class="presentation-data-header bgcol02">
            <div class="array-title-left">
              <i class="fa fa-bar-chart"></i><strong>成交量</strong>
            </div>
            <div class="array-list-right">
              <div class="dropdown clearfix">
                <button id="dLabel2" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" class="bgcol02">最近30天
                 <i class="fa fa-angle-down"></i>
                </button>
                <ul class="dropdown-menu choice-list" role="menu" aria-labelledby="dLabel2">
                  <li>最近3天</li>
                  <li>最近7天</li>
                  <li>最近30天</li>
                </ul>
              </div>
            </div>
            <!-- 下三角标签 -->
            <i class="fa fa-caret-down down-triangle"></i>
          </div>
          <ul class="presentation-array-list">
            <li>
              <div class="array-list-left">
                <span class="rank bgcol02">1</span>经纪人
              </div>
              <div class="array-list-right ellipsis">12000元</div>
            </li>
            <li>
              <div class="array-list-left">
                <span class="rank bgcol02">2</span>经纪人
              </div>
              <div class="array-list-right ellipsis">12000元</div>
            </li>
            <li>
              <div class="array-list-left">
                <span class="rank bgcol02">3</span>经纪人
              </div>
              <div class="array-list-right ellipsis">12000元</div>
            </li>
            <li>
              <div class="array-list-left">
                <span class="rank bgcol02">4</span>经纪人
              </div>
              <div class="array-list-right ellipsis">12000元</div>
            </li>
            <li>
              <div class="array-list-left">
                <span class="rank bgcol02">5</span>经纪人
              </div>
              <div class="array-list-right ellipsis">12000元</div>
            </li>
          </ul>
          <div class="more-ranking">
              <a href="javascript:;"><i class="fa fa-plus"></i>更多</a>
          </div>
        </div>
        <div class="col-sm-12 col-lg-4">
          <div class="presentation-data-header bgcol03">
            <div class="array-title-left">
              <i class="fa fa-pie-chart"></i><strong>报备数</strong>
            </div>
            <div class="array-list-right">
              <!-- <div class="dropdown clearfix">
                <button id="dLabel3" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" class="bgcol03">最近30天
                 <i class="fa fa-angle-down"></i>
                </button>
                <ul class="dropdown-menu choice-list" role="menu" aria-labelledby="dLabel3">
                  <li>最近3天</li>
                  <li>最近7天</li>
                  <li>最近30天</li>
                </ul>
              </div> -->
            </div>
            <!-- 下三角标签 -->
            <i class="fa fa-caret-down down-triangle"></i>
          </div>
          <ul class="presentation-array-list">
            <li>
              <div class="array-list-left">
                <span class="rank bgcol03">1</span>经纪人
              </div>
              <div class="array-list-right ellipsis">12000元</div>
            </li>
            <li>
              <div class="array-list-left">
                <span class="rank bgcol03">2</span>经纪人
              </div>
              <div class="array-list-right ellipsis">12000元</div>
            </li>
            <li>
              <div class="array-list-left">
                <span class="rank bgcol03">3</span>经纪人
              </div>
              <div class="array-list-right ellipsis">12000元</div>
            </li>
            <li>
              <div class="array-list-left">
                <span class="rank bgcol03">4</span>经纪人
              </div>
              <div class="array-list-right ellipsis">12000元</div>
            </li>
            <li>
              <div class="array-list-left">
                <span class="rank bgcol03">5</span>经纪人
              </div>
              <div class="array-list-right ellipsis">12000元</div>
            </li>
          </ul>
          <div class="more-ranking">
              <a href="javascript:;"><i class="fa fa-plus"></i>更多</a>
          </div>
        </div>
      </div>
    </div>  
  </div>
</body>
<script type="text/javascript" src="js/main.js"></script>
</html>
